<!doctype html>
<html class="no-js" lang="en">
<head>
        <!-- meta data -->
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->

        <!--font-family-->
		<link href="https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
        
        <!-- title of site -->
        <title>Directory Landing Page</title>

        <!-- For favicon png -->
		<link rel="shortcut icon" type="image/icon" href="/logo/favicon.png"/>
       
        <!--font-awesome.min.css-->
        <link rel="stylesheet" href="css/font-awesome.min.css">

        <!--linear icon css-->
		<link rel="stylesheet" href="css/linearicons.css">

		<!--animate.css-->
        <link rel="stylesheet" href="css/animate.css">

		<!--flaticon.css-->
        <link rel="stylesheet" href="css/flaticon.css">

		<!--slick.css-->
        <link rel="stylesheet" href="css/slick.css">
		<link rel="stylesheet" href="css/slick-theme.css">
		
        <!--bootstrap.min.css-->
        <link rel="stylesheet" href="css/bootstrap.min.css">
		
		<!-- bootsnav -->
		<link rel="stylesheet" href="css/bootsnav.css" >	
        
        <!--style.css-->
        <link rel="stylesheet" href="css/style.css">
        
        <!--responsive.css-->
        <link rel="stylesheet" href="css/responsive.css">
        
        <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
		
        <!--[if lt IE 9]>
			<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
			<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
        <![endif]-->

    </head>
<style>

	html,body{
		height: 100%;
	}
    .nav-li
    {
        position: relative;
        display: inline-block;
        vertical-align: middle;
        line-height: 60px;
        margin-left:0px;
    }
	.topcontainer{
		padding-right: 15px;
		padding-left: 15px;
		margin-right: auto;
		margin-left: auto;
		line-height:86px;
		vertical-align: middle;
	}
	.navbar-right2{
		float: left;
		margin-left: 50px;
	}
	.date{
		float: right;
		margin-right: 20px
	}

	.top-area{
		height: 90px;
	}
	.welcome-hero{
		height: calc(100% - 90px);
	}
	.wrapper{
		height: 100%;
	}
</style>
	<body onload="getNowDate()">	
		<!-- top-area Start -->
		<section class="top-area" >
			<div class="header-area">
				<!-- Start Navigation -->
			    <nav class="navbar navbar-default bootsnav  navbar-sticky navbar-scrollspy"  data-minus-value-desktop="70" data-minus-value-mobile="55" data-speed="1000">

			        <div class="topcontainer">

			            <!-- Start Header Navigation -->
			            <div class="navbar-header">

                            <li class="nav-li">
                                <a style="font-size: 28px; font-weight: bold; color: #000" >
                                    <img src="images/restimage/回形纹.png" height="50" width="50" />山东省非遗地图数字化系统</a>
                            </li>
			            </div>
			            <!-- End Header Navigation -->

			            <!-- Collect the nav links, forms, and other content for toggling -->
						<div class="collapse navbar-collapse menu-ui-design" id="navbar-menu">
			                <ul class="nav navbar-nav navbar-right2" data-in="fadeInDown" data-out="fadeOutUp">
			                    <li class=" scroll active" id="homePageButton"><a href="#home" style="font-size: 18px" >首页</a></li>
			                    <li class="scroll" id="mapButton"><a href="" style="font-size: 18px">地图</a></li>
			                    <li class="scroll" id="detailButton"><a href="" style="font-size: 18px">清单</a></li>
			                    <li class="scroll" id="museumButton"><a href="" style="font-size: 18px">非遗博物馆</a></li>
								<li class="scroll" id="cummunityButton"><a href="" style="font-size: 18px">交流社区</a></li>
                            </ul><!--/.nav -->
                           <span id="info" class="date"></span>

			            </div><!-- /.navbar-collapse -->

			        </div><!--/.container-->
			    </nav><!--/nav-->
			    <!-- End Navigation -->
			</div><!--/.header-area-->
<!--		    <div class="time"><span id="info"></span></div>-->

		</section><!-- /.top-area-->
		<!-- top-area End -->

		<!--welcome-hero start -->
		<section id="home" class="welcome-hero">
			<div style="height: calc(100% - 10px)">
		<iframe   sandbox="allow-scripts allow-forms allow-popups allow-same-origin" src="./homepage.html" frameborder="0" id="contentIframe" style="width: 100%;height: 100%"></iframe>
			</div>
		</section>


		<script src="js/plugins/jquery.js"></script>
        
        <!--modernizr.min.js-->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js"></script>
		
		<!--bootstrap.min.js-->
        <script src="js/bootstrap.min.js"></script>
		
		<!-- bootsnav js -->
		<script src="js/bootsnav.js"></script>

        <!--feather.min.js-->
        <script  src="js/feather.min.js"></script>

        <!-- counter js -->
		<script src="js/jquery.counterup.min.js"></script>
		<script src="js/waypoints.min.js"></script>

        <!--slick.min.js-->
        <script src="js/slick.min.js"></script>

		<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js"></script>
		     
        <!--Custom JS-->
        <script src="js/custom.js"></script>
        
    </body>
<script type="text/javascript">

	$('#mapButton').on('click',function(){
		$(window.parent.document).find('#contentIframe').attr('src','./map.html')})

	$('#homePageButton').on('click',function(){
		$(window.parent.document).find('#contentIframe').attr('src','./homepage.html')})

	$('#detailButton').on('click',function(){
		$(window.parent.document).find('#contentIframe').attr('src','./detail.html')})

	$('#museumButton').on('click',function(){
		$(window.parent.document).find('#contentIframe').attr('src','./3D照片墙.html')})

	$('#cummunityButton').on('click',function(){
		$(window.parent.document).find('#contentIframe').attr('src','./html/detail_index.html')
	})


    function getNowDate() {
        var date = new Date();
        var year = date.getFullYear() // 年
        var month = date.getMonth() + 1; // 月
        var day = date.getDate(); // 日
        var hour = date.getHours(); // 时
        var minutes = date.getMinutes(); // 分
        var seconds = date.getSeconds() //秒
        var weekArr = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
        var week = weekArr[date.getDay()];
        // 给一位数数据前面加 “0”
        if (month >= 1 && month <= 9) {
            month = "0" + month;
        }
        if (day >= 0 && day <= 9) {
            day = "0" + day;
        }
        if (hour >= 0 && hour <= 9) {
            hour = "0" + hour;
        }
        if (minutes >= 0 && minutes <= 9) {
            minutes = "0" + minutes;
        }
        if (seconds >= 0 && seconds <= 9) {
            seconds = "0" + seconds;
        }
        document.getElementById("info").innerHTML = year + "年" + month + "月" + day + "日" + " " + week;
      //  return currentdate;
    }

</script>
</html>